<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>定时器</title>
</head>
<body>
<div>参数资料: <a href="https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout">https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout</a></div>
<p>更多内容, 审查元素 或 查看源码</p>
<p id="text"></p>
<script>
  // 1.返回值问题
  var i = setTimeout(function(){text.textContent = 'setTimeout done'}, 1000)
	// It may be helpful to be aware that setTimeout() and setInterval() share the same pool of IDs, and that clearTimeout() and clearInterval() can technically be used interchangeably.
	// clearInterval(i) 相当于clearTimeout(i)

	myArray = ['zero', 'one', 'two'];
	myArray.myMethod = (function (sProperty) {
	    // this 指向 myArray
			console.log(arguments.length > 0 ? this[sProperty] : this);
	})

	// 2.this问题
  // setTimeout的黑魔法, 函数里的this会指向window, 这是个设计的bug.
	setTimeout(myArray.myMethod, 1000); // prints window
	// 必须bind一下才行
	setTimeout(myArray.myMethod.bind(myArray), 1000); // prints "zero,one,two" because 'this' is bound to myArray in the function

  // 3. 执行时机问题
	// Because setTimeout, is placed on a queue and scheduled to run at the next opportunity, not immediately.
	// Currently executing code must complete before functions on the queue are executed

	function foo() {
		console.log('foo has been called in setTimeout');
	}
	// 最大值 2147483647, 超过了会马上执行, 也许相当于0? 
	setTimeout(foo, 0);
	console.log('After setTimeout');

	// 4. 延迟过久的原因
	// 1) 最小延迟时间为 4ms
	// 2) 当前任务未执行完毕
	// 3) 非当前tab会延长 间隔时间


</script>
</body>
</html>
